<template>
  <div>
    <c-table
      :loading="loading"
      :height="height"
      :table-column="tableColumn"
      :table-data="list"
      :operation="!disabled"
      @on-save="onSave"
      @on-delete="deleteHandle"
      @qualityDescribe="detailHandle"
      @modify="modifyHandle"
      @focus="focusHandle"
    ></c-table>
    <issue-tracking-dialog v-if="issueTrackingData.show" :params="issueTrackingData.params" @close="issueTrackingCloseHandle"/>
    <detail-dialog v-if="detailData" :disabled="disabled" :detail-data="detailData" @close="detailColoseHandle"/>
  </div>
</template>

<script>
import IssueTrackingDialog from '@/components/IssueTrackingDialog.vue'
import DetailDialog from './DetailDialog.vue'
import {tableColumn} from './data'
import qualityApi from '@/apis/overview/quality'
import overviewApis from '@/apis/overview/index.js'

export default {
  components: {DetailDialog, IssueTrackingDialog},
  props: {
    loading: {
      type: Boolean,
      default: false
    },
    list: {
      type: Array,
      default() {
        return []
      }
    },
    isDelete: {
      type: Boolean,
      default: true
    },
    height: {
      type: String,
      default: null
    },
    disabled: {
      type: Boolean,
      default: false
    }
  }, 
  data() {
    return {
      tableColumn: JSON.parse(JSON.stringify(tableColumn)),
      issueTrackingData: {
        show: false,
        params: {
          billId: 0,
          type: ''
        }
      },
      detailData: null
    }
  },
  methods: {
    onSave(row) {
      const postData = {
        id: row.id,
        qualityType: row.qualityType.code,
        qualitySource: row.qualitySource.code,
        qualityProgressPlan: row.qualityProgressPlan,
        calculateProgressPlan: row.calculateProgressPlan
      }
      qualityApi.qualityUpdate(postData).then(() => {
        this.$message.success('保存成功')
        this.refresh()
      })
    },
    detailHandle(row) {
      this.detailData = row
    },
    modifyHandle(key, row, isComplete) {
      this.cacheModifyData = {
        key,
        row
      }
      if (this.disabled) {
        return
      }
      let type = key == 'qualityProgress' ? 'ZLWTJDGZ' : 'JYFSJDGZ'
      if (isComplete) {
        overviewApis.saveProgressRecord({
          billId: row.id,
          type: type,
          complete: 1
        }).then(() => {
          // this.refresh()
          this.issueTrackingRefreshRow()
        })
      } else {
        this.issueTrackingData.show = true
        this.issueTrackingData.params.billId = row.id
        this.issueTrackingData.params.type = type
      }
    },
    focusHandle(row) {
      if (this.disabled) {
        return
      }
      qualityApi.qualityFocus({id: row.id}).then(() => {
        this.refresh()
      })
    },
    deleteHandle(row) {
      this.$confirm('确认删除?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
          qualityApi.qualityDeleteById({id: row.id}).then(() => {
          this.$message.success('删除成功')
          this.refresh()
        })
      })
    },
    issueTrackingCloseHandle(refresh) {
      if (refresh) {
        // this.refresh()
        this.issueTrackingRefreshRow()
      }
      this.issueTrackingData.show = false
    },
    detailColoseHandle(refresh) {
      if (refresh) {
        this.refresh()
      }
      this.detailData = null
    },
    refresh() {
      this.$emit('refresh')
    },
    issueTrackingRefreshRow() {
      const {key, row} = this.cacheModifyData
      const valueMap = this.tableColumn[key].valueMap
      qualityApi
        .findPageList({
          id: row.id
        })
        .then(({ data }) => {
          const { list } = data
          const newData = list[0]
          Object.assign(row, {
            [valueMap.value]: newData[valueMap.value],
            [valueMap.progress]: newData[valueMap.progress],
            [valueMap.count]: newData[valueMap.count],
            qualityColor: newData['qualityColor'],
            qualityProp: newData['qualityProp'],
          })
        })
    }
  }
}
</script>

<style>

</style>